<!--
* @description  参数1
* @fileName  clientSale
* @author userName
* @date 2021-04-08 20:18:32
* @version V1.0.0
!-->
<template>
    <div id="clientSale" class="clientSale">
        <!-- 轮播图 -->
        <div class="block" style="width:78%;margin:0 auto">
            <el-carousel height="460px">
                <el-carousel-item
                    v-for="item in AdvertisementList"
                    :key="item.fid"
                    style="display: flex;align-items: center;justify-content: center;"
                >
                    <img style="height:100%; width:100% " :src="item.picture" />

                    <!-- <img style="height:460px;" :src="$targetr + item.big_pic"/> -->
                </el-carousel-item>
            </el-carousel>
        </div>
        <!-- 轮播图END -->

 <el-button v-if="active < 2" type="danger" style="display:block;margin:30px auto;" round @click="clientUpdateSale()">修改订单</el-button>
        <el-steps :active="active" align-center style="position:relative;top:20px">
            <el-step title="接收订单"></el-step>
            <el-step title="开始制作"></el-step>
            <el-step title="已完成" type="success"></el-step>
        </el-steps>

        <!-- 
        <button  style="text-align:center;position:relative;top:140px">刷新</button> -->
        <div>
            <i class="el-icon-refresh" @click="freshen()" style="position: relative;left: 48.5%;top:50px;font-size:45px"></i>
        </div>
        <el-button v-if="active == 3" type="primary" style="position: relative;left: 43.5%;top:100px;font-size:45px" @click="returnHome()">回到主页</el-button>
    </div>
</template>

<script>
import { findsale } from '../../api/sale';
import { allSlideShow } from '../../api/slideshow';
export default {
    inject: ['reload'],
    props: {
        // 父辈向子辈传参
    },
    name: 'clientSale',
    data() {
        return {
            active: 1,
            AdvertisementList: [],
            timer: null // 定时器名称
        };
    },
    created() {
        // 实例被创建之后执行代码
        this.acction();
        this.selectAdvertisement();
        this.setTime(10000);
    },
    computed: {
        // 计算属性
    },
    components: {
        // 组件的引用
    },
    methods: {
        clientUpdateSale(){
           localStorage.setItem("clientUpdateSale",true)
            this.$router.push('/allfood');
        },
        selectAdvertisement() {
            allSlideShow()
                .then(res => {
                    // console.log(res);
                    // console.log('aaaaaaaaa');
                    this.AdvertisementList = res.data.slideshowlist;
                    // console.log('aaaaaaaaa');
                    // console.log(this.AdvertisementList);
                })
                .catch(res => {
                    this.$message.error('出错了哦');
                });
        },
        // 方法
        returnHome() {
            this.$router.push('/allfood');
        },
        setTime(time) {
            const timer = setInterval(() => {
                this.acction();
                // console.log('Settime');
            }, time);

            this.$once('hook:beforeDestroy', () => {
                clearInterval(timer);
            });
        },
        freshen() {
            this.reload();
        },
        acction() {
            var datetime = localStorage.getItem('datetime');
            var uid = localStorage.getItem('uid');
            // console.log(datetime, uid);
            var ddd = JSON.stringify({
                // 参数
                datetime,
                uid
            });
            this.clientSelectSale(ddd);
        },
        clientSelectSale(ddd) {
            findsale(ddd).then(res => {
                // console.log(res);
                if (res.code == 200) {
                    // console.log('selectsale');
                    var begin1 = 0;
                    var begin2 = 0;
                    var begin3 = 0;
                    for (var i = 0; i < res.data.length; i++) {
                        // console.log(res.data[i].status + '    i');
                        var status = res.data[i].status;
                        // if (res.data[i].status == 3) {
                        //     begin = 3;
                        // } else if (res.data[i].status == 2) {
                        //     begin = 2;
                        // } else if (res.data[i].status == 1) {
                        //     begin = 1;
                        // }

                        status == 3 ? (begin3 = 3) : status == 2 ? (begin2 = 2) : (begin1 = 1);
                        // console.log(begin1 + "  begin1");
                        //  console.log(begin2 + "  begin2");
                        //   console.log(begin3 + "  begin3");
                    }
                    begin1 == 1 ? (this.active = 1) : begin2 == 2 ? (this.active = 2) : (this.active = 3);
                    // console.log(this.active + "    active");

                    // if (begin == 2) {
                    //     this.active = 2;
                    // } else if (begin == 3) {
                    //     this.active = 3;
                    // }

                    if (this.active == 3) {
                        clearInterval(this.timer);
                        // console.log('销毁定时器');
                    }
                } else if (res.code !== 200) {
                    that.$message.error('出错了哦');
                }
            });
        }
    },
    mounted() {
        // 页面进入时加载内容
    },
    watch: {
        // 监测变化
    }
};
</script>
<style scoped></style>
